<!DOCTYPE html>
<html xmlns:th="www.thymeleaf.org">
<meta charset="UTF-8">
<head th:replace="back/index::ph('查询作业')"></head>
<body>
	<header th:replace="back/index::header"></header>
	<main>
		<div class="content">
			<fieldset>
				<legend><a href="/">首页</a> >> 查询作业</legend>
				<div>
					<label v-for="(v,k,i) in args">
						{{cols[k]}}：<input v-model="args[k]" :id="k">
					</label>
					<button @click="find">查询</button>
				</div>
				<table>
					<tr><th>序号</th><th v-for="c in cols">{{c}}</th></tr>
					<tr v-for="(u,i) in data.content">
						<td>{{i+1}}</td>
						<td v-for="(value,key,index) in cols">{{val(u,key)}}</td>
					</tr>
				</table>
			</fieldset>
		</div>
	</main>
	<footer th:replace="back/index::footer"></footer>
</body>
<script type="text/javascript">
	var v = new Vue({
		el : "main",
		data : {
			args : { clsSn:"", "course.name":"", name:""},
			cols : { clsSn:"班级", "course.name":"课程", name:"名称", finishAt:"完成时间", inTime:"提交时间"},
			data : {}
		},
		methods : {
			find(){
				axios.post("hwctask/task/find", usp(this.args)).then(res=>{
					this.data = res.data;
				});
			},
			val(obj,field){
				try{
					return eval('obj.' + field);
				}catch(e){
					return '';
				}
			}
		},
		created(){
			this.find();
		}
	});


</script>
</html>